<template>
    <div class="box-line">
        <text class="box-line-text">{{title}}</text>
        <input class="box-line-input" @input="onInput" :placeholder="hinttext"/>
    </div>
</template>
<script>
    import native from "../../../common/WeexNativeModule"

    export default {
        name: "InputItem",
        props: ['title', 'hinttext','key'],
        methods: {
            onInput: function (event) {
                let self = this;
                let value = event.value;
                let inputList = self.$parent.$data.inputList;
                if(inputList){
                    for(let key in inputList){
                        let item = inputList[key];
                        if(item && item.title === self.title){
                            item.value = value;
                        }
                    }
                }
            }
        }
    }
</script>
<style>
    .box-line {
        flex: 1;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
    }
    .box-line-text{
        width: 60px;
        font-size: 12px;
        color: #666666;
    }
    .box-line-input{
        flex: 1;
        font-size: 12px;
        padding-left: 5px;
        height: 25px;
        color: #666666;
        border-width: 0.5px;
        border-radius: 5px;
        border-color: #b1b1b1;
    }
</style>